<template>
	<view class="page">
		<pageTxt>
			<!--  v-model="dataList" @query="queryList" -->
			<z-paging ref="paging" refresher-only @onRefresh="onRefresh"
				:paging-style="{ 'background-color': '#f7f7f7', height: '100%', width: '100%' }">
				<!-- 头部 -->
				<template slot="top">
					<u-navbar title="勘场详情" :autoBack="true" :fixed="false"></u-navbar>
				</template>
				<!-- 内容 -->
				<view class="detail-content-box" v-if="dataObj">
					<u-empty v-if="!$fieldShowFunc('31-xmxx') && !$fieldShowFunc('31-kcxx')" marginTop="300rpx"
						icon="https://hzybucket.obs.cn-south-1.myhuaweicloud.com/we_chat/no-msg2.png" text=" "></u-empty>
					<view class="item-box" v-if="$fieldShowFunc('31-xmxx')">
						<view class="title">项目信息</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_xmmc')">
							<text class="txt">项目名称</text>
							<view class="content">
								{{ dataObj.project_name }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_xmbh')">
							<text class="txt">项目编号</text>
							<view class="content flex ac">
								<text class="txt-btn" @click="navToProjectFunc">
									{{ dataObj.project_number }}
								</text>
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_xmpp')">
							<text class="txt">项目品牌</text>
							<view class="content flex ac">
								{{ dataObj.brand_name }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_xmlx')">
							<text class="txt">项目类型</text>
							<view class="content flex ac">
								{{ dataObj.store_type_name }}
							</view>
						</view>
					</view>
					<view class="item-box" v-if="$fieldShowFunc('31-kcxx')">
						<view class="title">勘场信息</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_sjs')">
							<text class="txt">设计师</text>
							<view class="content flex ac">
								{{ dataObj.designer_name || '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_kcgcjl')">
							<text class="txt">勘场工程经理</text>
							<view class="content flex ac">
								{{ dataObj.site_surveyors_name || '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_kczt')">
							<text class="txt">勘场状态</text>
							<view class="content flex ac">
								<template v-if="dataObj.survey_site_status == 1">待勘场</template>
								<template v-if="dataObj.survey_site_status == 2">待勘场出图</template>
								<template v-if="dataObj.survey_site_status == 3">已完成</template>
								<template v-if="!dataObj.survey_site_status">--</template>
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_sqkcrq')">
							<text class="txt">申请勘场日期</text>
							<view class="content flex ac">
								{{ dataObj.apply_survey_date || '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_ydkcrq')">
							<text class="txt">实际勘场日期</text>
							<view class="content flex ac">
								{{ dataObj.actual_survey_date || '--' }}
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_xctp')">
							<text class="txt">现场图片</text>
							<view class="content flex ac flex">
								<image v-for="(item, idx) in dataObj.project_file.scene_file" :key="idx" :src="$fileImgFunc(item)"
									@click="previewFunc(item)" mode="aspectFill" class="img-box"></image>
								<template v-if="!dataObj.project_file.scene_file.length">--</template>
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_xcsp')">
							<text class="txt">现场视频</text>
							<view class="content flex ac flex">
								<image v-for="(item, idx) in dataObj.project_file.video_file" :key="idx" :src="$fileImgFunc(item)"
									@click="previewFunc(item)" mode="aspectFill" class="img-box"></image>
								<template v-if="!dataObj.project_file.video_file.length">--</template>
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_kcbg')">
							<text class="txt">勘场报告</text>
							<view class="content flex ac flex">
								<image v-for="(item, idx) in dataObj.project_file.report_file" :key="idx" :src="$fileImgFunc(item)"
									@click="previewFunc(item)" mode="aspectFill" class="img-box"></image>
								<template v-if="!dataObj.project_file.report_file.length">--</template>
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_sht')">
							<text class="txt">手绘图</text>
							<view class="content flex ac flex">
								<image v-for="(item, idx) in dataObj.project_file.sketch_file" :key="idx" :src="$fileImgFunc(item)"
									@click="previewFunc(item)" mode="aspectFill" class="img-box"></image>
								<template v-if="!dataObj.project_file.sketch_file.length">--</template>
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_kczl')">
							<text class="txt">勘场资料</text>
							<view class="content flex ac flex">
								<image v-for="(item, idx) in dataObj.project_file.survey_data" :key="idx" :src="$fileImgFunc(item)"
									@click="previewFunc(item)" mode="aspectFill" class="img-box"></image>
								<template v-if="!dataObj.project_file.survey_data.length">--</template>
							</view>
						</view>
						<view class="item-box-item flex jb" v-if="$fieldShowFunc('kc_kcctsj')">
							<text class="txt">勘场出图时间</text>
							<view class="content flex ac">
								{{ dataObj.upload_materials_date || '--' }}
							</view>
						</view>
					</view>
				</view>
				<view class="bottom-btn-box flex ac jb" slot="bottom">
					<view style="width: 100%" v-if="!loading">
						<judgeBtn info unborder :per_arr="per_arr" objectType="payment" :btns="btns" :state="dataObj.status"
							:item="dataObj" @change="btnsChange"></judgeBtn>
					</view>
				</view>
			</z-paging>
		</pageTxt>
		<!-- 文件预览 -->
		<preFileCom :fileObj="fileObj" @onFileSuccess="fileObj = ''"></preFileCom>
		<!-- 操作组件 -->
		<siteSurveyOperate :value.sync="per_name" :oper_item="oper_item" @submit="handleSubmit"></siteSurveyOperate>
	</view>
</template>

<script>
	export default {
		provide() {
			return {
				providedData: this.btns
			};
		},
		data() {
			return {
				fileObj: '',
				loading: false,
				dataObj: '',
				per_arr: [], //权限列表
				// 操作按钮
				btns: [{
						per_name: 'design_engineeringManager',
						state: 1030,
						name: '分配勘场工程经理'
					},
					{
						per_name: 'siteSurvey_submitBg',
						state: 1045,
						name: '提交勘场报告'
					},
					{
						per_name: 'siteSurvey_submitZl',
						state: 1055,
						name: '上传勘场资料'
					},
					{
						per_name: 'design_changeDesigner',
						func: (item) => {
							if (item.designer_name) {
								return true;
							} else {
								return false;
							}
						},
						name: '更换设计师'
					},
					{
						per_name: 'siteSurvey_editGcjl',
						func: (item) => {
							if (item.site_surveyors_name) {
								return true;
							} else {
								return false;
							}
						},
						name: '更换勘场工程经理'
					},

				],
				// 操作相关
				per_name: '',
				oper_item: {}
			};
		},
		onLoad(option) {
			this.siteSurveyProjectDetails(option.id);
			// 获取权限
			this.$Api
				.getHtmlAuthority({
					path: '/siteSurveyManagement'
				})
				.then((res) => {
					console.log(res, 'getHtmlAuthority');
					if (res.code == 200) {
						this.per_arr = res.data.permission;
					}
				});
		},
		onShow() {
			if (this.dataObj) {
				this.siteSurveyProjectDetails(this.dataObj.id);
			}
		},
		methods: {
			// 操作反馈
			handleSubmit(e) {
				this.onRefresh();
			},
			// 操作事件
			btnsChange(e) {
				console.log(e);
				this.per_name = e.per_name;
				this.oper_item = e.item;
			},
			onRefresh() {
				this.siteSurveyProjectDetails(this.dataObj.id);
				this.$refs.paging.complete();
			},
			// 详情
			siteSurveyProjectDetails(project_id) {
				this.loading = true;
				this.$Apipc
					.siteSurveyProjectDetails({
						project_id
					})
					.then((res) => {
						console.log(res, '勘场详情');
						this.loading = false;
						if (res.code == 200) {
							this.dataObj = res.data;
						}
					});
			},
			// 预览
			previewFunc(item) {
				this.fileObj = item;
			},
			// 去详情项目
			navToProjectFunc() {
				uni.navigateTo({
					url: '/pagesB/projectDetail/projectDetail?id=' + this.dataObj.id
				});
			}
		}
	};
</script>

<style lang="scss" scoped></style>